<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
	<div style="width: 500px; margin: 0 auto;">
		<h1 style="text-align: center;">添加宠物信息</h1>
		<form action="add" method="post">
			<p>
				昵称:<input type="text" name="petName" id="petName"> <span id="petNameErr"></span>
			</p>
			<p>
				品种:<select name="petBreed">
						<option value="">--请选择---</option>
						<option value="狗">狗</option>
						<option value="猫">猫</option>
						<option value="鸟">鸟</option>
						<option value="老鼠">老鼠</option>
					</select>
			</p>
			<p>
				性别:<input type="radio" name="petSex" value="雄" checked="checked">雄
				<input type="radio" name="petSex" value="雌">雌
			</p>
			<p>
				出生日期:<input type="text" name="birthday">
			</p>
			<p>
				宠物描述:<textarea rows="4" cols="80" name="desc"></textarea>
			</p>
			<p>
				<input type="submit" value="提交">
			</p>
		</form>
	</div>
	<script type="text/javascript" src="js/jquery-3.2.1.js"></script>
	<script type="text/javascript">
		$(function(){
			$("#petName").blur(function(){
				$.ajax({
					url:"check",
					type:"get",
					data:"petName="+$("#petName").val()+"&petId=0&f=true",
					dataType:"text",
					success:function(n){
						if(n > 0){
							$("#petNameErr").text("昵称已存在,请重新输入!")
						}else{
							$("#petNameErr").text("");
						}
					},
					error:function(){
						$("#petNameErr").text("昵称已存在,请重新输入!")
					}
				})
			})
		})
	</script>
</body>
</html>